<script lang="ts" setup>
  import { buildStyles, getSize } from "../utils";

  interface InputProps {
    placeholder?: string;
    inputStyles?: any;
    width?: string | number;
  }

  const props = withDefaults(defineProps<InputProps>(), {
    placeholder: "请输入内容...",
  });

  const styles = buildStyles(() => {
    return {
      width: getSize(props.width),
    };
  });
</script>

<template>
  <div class="umrp-input">
    <input type="text" class="input" :placeholder="placeholder" :style="styles" />
  </div>
</template>

<style lang="scss" scoped>
  @use "common";
</style>
